<template>
	<!-- 登录页面 -->
	<view>
		<view class="title">
			欢迎来到车辆综合服务平台商家端
		</view>
		<uni-forms ref="baseForm" :modelValue="loginData">
			<uni-forms-item>
				<uni-easyinput v-model="loginData.mobile" placeholder="请输入手机号" :inputBorder="false"
					placeholderStyle="font-size:30rpx" />
				<view style="border: 1rpx solid #EAEAEA; margin-left:15rpx;"></view>
			</uni-forms-item>


			<uni-forms-item>
				<view style="display: flex;">
					<view style="width: 550rpx;">
						<uni-easyinput v-model="loginData.code" placeholder="请输入手机验证码" :inputBorder="false"
							placeholderStyle="font-size:30rpx" />
					</view>
					<view v-if="isAuthCode" class="check">
						<uni-countdown :show-day="false" :showHour="false" :showMinute="false" :second="timeupSecond"
							@timeup="timeup" />
					</view>
					<view v-if="!isAuthCode" class="check">
						<view class="authCode" @click="isHide">获取验证码</view>
					</view>
				</view>
				<view style="border: 1rpx solid #EAEAEA; margin-left: 15rpx;"></view>
			</uni-forms-item>

			<navigator class="toRegister" url="/pages/register/register">
				立即注册
			</navigator>
			<button type="primary" @click="submit(loginData)">登录</button>
		</uni-forms>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				loginData: {
					mobile: '13722379809',
					code: '5359'
				},
				timeupSecond: 29,
				isAuthCode: false,

			}
		},
		methods: {
			submit(e) {
				uni.request({
					url: 'http://localhost:7000/auth/businessLogin',
					method: 'POST',
					data: this.loginData,
					success: (resp) => {
						getApp().globalData.token = "Bearer " + resp.data.data.access_token
					}
				})
			},
			isHide() {
				if (this.loginData.mobile === "") {
					return;
				}
				this.isAuthCode = true
				uni.request({
					url: "http://localhost:7000/auth/msg",
					method: 'POST',
					data: {
						mobile: this.loginData.mobile,
						resource: 0
					}
				})
			},
			timeup() {
				this.isAuthCode = false
			},

		}
	}
</script>

<style>
	page {
		background-color: white;
		padding: 25rpx;
	}

	.title {
		font-size: 36rpx;
		font-weight: 800;
	}

	.uni-forms {
		margin-top: 80rpx;
	}

	.toRegister {
		color: #3A82FF;
		margin: 0 0 20rpx 20rpx;
	}

	.check {
		margin-left: auto;
		line-height: 70rpx;
		color: rgba(29, 111, 255, 1);
	}

	.uni-countdown {
		line-height: 70rpx !important;
		height: 70rpx !important;
	}
</style>